<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<html>
<head>
    <title>段落详情</title>

    <link rel="stylesheet" href="${ctx}/static/styles/doc_detail.css" type="text/css">
    <script src="${ctx}/static/js/pdfobject.min.js"></script>

    <c:if test="${!empty exists}">
        <script>
            document.onreadystatechange = function () {
                if (document.readyState == "complete") {
                    PDFObject.embed("${ctx}/resource/docs/${doc.location}", "#ex");
                }
            }
        </script>
    </c:if>
</head>

<body>
<div class="std-main">
    <div class="container">
        <h5>段落详情</h5>
        <div class="std-detail">
            <div class="std-name">
                <h2>文档标题：${doc.title}</h2>
                <p>作者：${doc.authors}</p>
            </div>
            <div class="std-info">
                <p>段落内容：${para.content}</p>
                <p>段落在文档中顺序：${para.orderInDocument}</p>
                <p>段落在文档中的高度：${para.height}</p>
                <p>段落在文档中的宽度：${para.width}</p>

            </div>
            <c:if test="${docType eq 'pdf'}">
                <a class="std-detail-another" data-toggle="modal" data-target="#myModal">
                    查看PDF全文
                </a>
            </c:if>
        </div>
    </div>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">PDF详情</h4>
            </div>
            <div class="modal-body">
                <c:if test="${!empty exists}">
                    <div id="example">
                        <embed class="pdfobject" src="${ctx}/resource/docs/${doc.location}" type="application/pdf"
                               style="width: 100%; height: 400px;">
                    </div>
                </c:if>
                <c:if test="${empty exists}">
                    <div id="example">
                        <p>该文档不存在PDF。</p>
                    </div>
                </c:if>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">保存修改</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>
